<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我的粉丝</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/common.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/member.css"/>
    <script type="text/javascript" src="../../script/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../../script/mobile.js"></script>
    <script type="text/javascript">
        window['adaptive'].desinWidth = 750;
        window['adaptive'].baseFont = 28;
        window['adaptive'].maxWidth = 750;
        window['adaptive'].init();
    </script>
</head>

<body>
<div id="header" style="height: 0.9rem; background: #fff; position: fixed; top: 0;left: 0; width: 100%; z-index: 99">
    <header class="header header-shadow">
        <div class="header-left">
            <div tapmode onclick="comeBack();" class="nav-left"><img class="icon-back" src="../../icon/icon-back.png"/>
            </div>
        </div>
        <h2>我的粉丝</h2>
    </header>
</div>

<div class="mescroll" id="mescroll" style="padding-top: 1.5rem">

    <section class="html_section pr30 pl30 ">
        <ul class="usesrLike_list">
            <!-- <li id="li_1">
                <div class="like_content">
                    <div class="member_head"><img src="../../image/img-tx.png" /></div>
                    <div class="like_details">
                        <div class="like_center">娱乐<img class="icon-hz ml10" src="../../icon/icon-hz01.png" /></div>
                        <div class="c-999 f24 single-ellipsis">无拘无束，自由自在</div>
                    </div>
                </div>
                <div class="like_btn1 like_btn" onclick="qxLike(this)"></div>
            </li>
            <li id="li_1">
                <div class="like_content">
                    <div class="member_head"><img src="../../image/img-tx.png" /></div>
                    <div class="like_details">
                        <div>娱乐</div>
                        <div class="c-999 f24 single-ellipsis">无拘无束，自由自在</div>
                    </div>
                </div>
                <div class="like_btn3 like_btn"></div>
            </li>
            <li id="li_1">
                <div class="like_content">
                    <div class="member_head"><img src="../../image/img-tx.png" /></div>
                    <div class="like_details">
                        <div>娱乐</div>
                        <div class="c-999 f24 single-ellipsis">无拘无束，自由自在</div>
                    </div>
                </div>
                <div class="like_btn2 like_btn"></div>
            </li> -->
        </ul>
    </section>
</div>


</body>

</html>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<link rel="stylesheet" type="text/css" href="../../css/mescroll.min.css"/>
<script type="text/javascript" src="../../script/mescroll.min.js"></script>
<script type="text/javascript">
    var uid = 0;
    apiready = function () {
        setFixStatusBar(); //设置状态栏
        pop.loading();
        keybackListener()
        //下拉刷新
       /* dropDownRefresh(function () {
            ready();
        })*/
        var param = api.pageParam;
        if(param.member_id){
            uid = param.member_id;
            $("#header h2").html('他的粉丝');
        }
        ready();
    }
    //创建MeScroll对象
    var mescroll = new MeScroll("mescroll", {
        down: {
            auto: false, //是否在初始化完毕之后自动执行下拉回调callback; 默认true
            callback: downCallback //下拉刷新的回调
        }
    });
    /*下拉刷新的回调 */
    function downCallback() {
        ready();

        //mescroll.endErr();
    }


    function ready() {
        var p ={
            token: $api.getStorage('token'),
        };
        if(uid!=0){
            p.uid = uid;
        }
        getAjax(Interface.get_fans, p, function (res) {
            console.log(jsonChange(res));
            var list = res.data;
            var html = '';
            $.each(list, function (i, item) {
                var badge_path = "";
                if(isDefine(item.badge_path)){
                    $.each(item.badge_path, function (j, jtem) {
                        if (jtem) {
                            badge_path += '<img class="icon-hz ml10" src="' + getImg(jtem) + '" />'
                        }
                    })
                }
                var result = {"member_id": item.id}
                var userVip = '';
                if(isDefine(item.attestation_status)){
                    if(item.attestation_status == 2){
                        userVip = '<span class="vip"></span>';
                    }
                }

                html += '<li id="li_' + item.id + '">';
                html += '<div class="like_content" onclick=\'commonUrl("../activity/person_index",' + jsonChange(result) + ')\'>';
                html += '<div class="userRelative" style="width: 0.8rem;height: 0.8rem;margin-right: 0;"><div class="member_head bg-cover" style="background-image: url(' + getImg(item.icon_path) + ');" ></div>'+userVip+'</div>';
                html += '<div class="like_details">';
                html += '<div>' + item.name + '</div>'
                if(isDefine(item.autograph) && item.autograph != "0"){
                    html += '<div class="c-999 f24 single-ellipsis">' + item.autograph + '</div>';
                }else {
                    html += '<div class="c-999 f24 single-ellipsis">'+commonNote+'</div>';
                }
                html += '</div>';
                html += '</div>';
                if(uid !=0){
                    if (item.mutual == 1){
                        html += '<div class="like_btn1 like_btn" data-stype="2" onclick="qxLike(this,' + item.id + ')" ></div>';
                    }
                    else if (item.mutual == 2){
                        html += '<div class="like_btn2 like_btn" data-stype="2" onclick="qxLike(this,' + item.id + ')" ></div>';
                    }
                    else{
                        html += '<div class="like_btn3 like_btn" data-stype="1" onclick="qxLike(this,' + item.id + ')" ></div>';
                    }
                }else{
                    if (item.mutual == 1){
                        html += '<div class="like_btn2 like_btn" data-stype="2" onclick="qxLike(this,' + item.id + ')" ></div>';
                    }
                    else{
                        html += '<div class="like_btn3 like_btn" data-stype="1" onclick="qxLike(this,' + item.id + ')" ></div>';
                    }
                }
                html += '</li>';
            })
            pop.close();
            $(".usesrLike_list").html(html);
            if (list.length == 0) {
                $(".usesrLike_list").html(noData);
            }
            mescroll.endSuccess()
        }, function (res, err) {
            mescroll.endErr()
        })
    }


    //取消关注
    function qxLike(e, id) {
        pop.loading();
        getAjax(Interface.follow, {
            token: $api.getStorage('token'),
            stype: $(e).data('stype'),
            pid: id,
            type: 1
        }, function (res) {
            pop.close();
            if ($(e).hasClass('like_btn3')) {
                $(e).removeClass('like_btn3');
                $(e).addClass('like_btn1');
                $(e).data('stype', 1);
            } else {
                $(e).removeClass('like_btn1');
                $(e).addClass('like_btn3');
                $(e).data('stype', 2);
            }
            api.sendEvent({
                name: 'memberInfo',
                extra: {}
            });
        }, function (res, err) {
        })

    }
</script>
